<template>
	<el-dialog @close="$emit('update:addAppdShow',false)" width="60%" 
	:visible.sync="appAddShow" :closeOnClickModal='false' class="addAppShow" :show-close='false'>
		<span slot="title" class="dialog-title">
		  	下载模板
			<el-button  size="mini" @click="close" class="popupClose">关闭</el-button>
		</span>
		<el-row style="margin-bottom:10px;">
			<input type="file" name="file" id="plFile" @change="upload" style="visibility: hidden;width: 0;height: 0;" multiple>
			<el-button size="mini" type="primary" style="float:right" @click="uploadClick">上传模板</el-button>
		</el-row>
		<el-table :data="renwufujian" style="width:100%;height:calc(100% - 38px)" class="tableCon" size="mini">
			<el-table-column label="序号" min-width="50px">
				<template slot-scope="scope">
					{{scope.$index+1}}
				</template>
			</el-table-column>
			<el-table-column prop="fileName" label="模板名称" min-width="200">
			</el-table-column>
			<el-table-column  label="操作" width="100">
				<template slot-scope="scope">
					<el-button type="text" size="small" @click="deleteattachment(scope.row)">删除</el-button>
					<el-button type="text" size="small" @click="dlownloadattachment(scope.row)">下载</el-button>
				</template>
			</el-table-column>
		</el-table>
		<span slot="footer" class="dialog-footer">
			<el-button @click="close" size="mini">取 消</el-button>
		</span>
	</el-dialog>
</template>

<script>
	export default {
		name: 'add-app-dialog',
		props: ['addAppdShow'],
		data() {
			return {
				renwufujian: [],
				
			}
		},
		mounted() {
			this.init();

		},
		computed: {
			tabDivHeight() {
				return (window.innerHeight - 460)
			},
			appAddShow: {
				get() {
					return this.addAppdShow
				},
				set() {

				}
			}
		},
		methods: {
			close() {
				this.$emit('update:addAppdShow', false)
			},
			init() {
				this.$http({
					method: 'post',
					apiUrl: 'download/getFilePathByIds.htm',
					params: { ids: 'asdfghjkl123456789' },
					isJson: false,
				}).then(res => {
					if (res.code == 0) {
						this.renwufujian = res.data
					} else {

					}

				}).catch(() => {

				});
			},
			uploadClick() {
				document.getElementById('plFile').click()
			},
			upload(event) {
				var files = document.getElementById('plFile').files;
				var formData = new FormData();
				for(var i of files){
					formData.append('file', i)
				}
				var fileType;
				// formData.append('file', files)
				formData.append('ids', "asdfghjkl123456789")
				formData.append('type', 3)
				formData.append('taskType', null)
				formData.append('detectability', null)
				formData.append('fileType', "checkFormwork")
				this.$axios({
					method: 'post',
					url: '/download/fileUpload.htm',
					data: formData,
					headers: { 
           'Content-Type': 'multipart/form-data',
           'token':sessionStorage.getItem('loginAccount')?sessionStorage.getItem('loginAccount'):undefined,
          }
				}).then(res => {
					event.target.value= "";
					var data = res.data
					if (data.code == 0) {
						this.$notify({
							title: '消息',
							message: '上传成功',
							type: 'success'
						})
						this.init();
					} else {
						this.$message({
							type: 'info',
							message: data.description,
						})
					}

				})
			},
			deleteattachment(row) {
				this.$confirm('是否删除', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.$http({
						method: 'post',
						apiUrl: '/download/fileDelete.htm',
						params: {
							id: row.id,
						},
						isJson: false,
					}).then(res => {
						if (res.code === 0) {
							this.$message({
								type: 'success',
								message: '删除成功!'
							});
							this.init()
						}
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},
			// 下载附件
			dlownloadattachment(row) {
				var url = "/download/fileDownload.htm"
        let token = sessionStorage.getItem('loginAccount')?sessionStorage.getItem('loginAccount'):undefined
				window.open(process.env.baseUrl + url + '?id=' + row.id + "&token=" + token);
			},

		},
	}

</script>

<style >
	.addAppShow .el-dialog {
		margin-top: 10vh !important;
		height: 80%;
	}

	.addAppShow .el-dialog .el-dialog__body {
		height: calc(100% - 85px);
		padding: 15px;
	}
</style>